<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <link rel="stylesheet" href="font/iconfont.css">
    <link rel="stylesheet" href="css/mui.min.css">
    <link rel="stylesheet" href="css/全职招聘.css">
    <link rel="stylesheet" href="css/swiper.min.css">
    <title>Document</title>
</head>

<body>
    <div class="all">
        <div class="all-two">
            <div class="nav">
                <div class="nav-left">
                    <i class="mui-icon mui-icon-home"></i>
                </div>
                <div class="nav-title">
                    百度百聘
                    <span>郑州&nbsp;▼</span>
                </div>
                <div class="nav-right">
                    <i class="iconfont icon-sousuo"></i>
                    <i class="iconfont icon-liebiao"></i>
                </div>
            </div>
            <div class="swiper-container">
                <div class="swiper-wrapper">
                    <div class="swiper-slide">
                        <img src="https://zhaopin-c.bj.bcebos.com/%E6%9A%96%E6%98%A5%E8%81%8C%E9%80%9A%E8%BD%A6/bpwise-ztc_.jpg" alt="">
                    </div>
                    <div class="swiper-slide">
                        <img src="https://zhaopin-c.bj.bcebos.com/banner/wise-indexqiyeban.png" alt="">
                    </div>
                </div>
                <!-- Add Pagination -->
                <div class="swiper-pagination"></div>
            </div>
            <div class="right-nav">
                <i class="mui-icon mui-icon-arrowthinup"></i>
            </div>
            <div class="nav-bottom">
                <ul class="nav-bottom-list">
                    <li>综合排序&nbsp;<span class="mui-icon mui-icon-arrowdown"></span></li>
                    <li>职位&nbsp;<span class="mui-icon mui-icon-arrowdown"></span></li>
                    <li>全郑州&nbsp;<span class="mui-icon mui-icon-arrowdown"></span></li>
                    <li>更多&nbsp;<span class="mui-icon mui-icon-arrowdown"></span></li>
                </ul>
                <i class="mui-icon mui-icon-bars"></i>
            </div>
            <div class="content">
                <div class="content-title">

                </div>
            </div>
        </div>
    </div>
    <!-- Swiper JS -->
    <script src="./js/mui.min.js"></script>
    <script src="./js/swiper.min.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>

    <!-- Initialize Swiper -->

    <script>
        var swiper = new Swiper('.swiper-container', {
            pagination: '.swiper-pagination',
            paginationClickable: true,
            autoplay: 3000
        });
        var swiper = new Swiper('.eight-list', {
            pagination: '.swiper-pagination',
            paginationClickable: true,
        });
        //获得slider插件对象
    </script>
    <script>
        // 在iphone6 375宽度中  html是以20px作为基本单位
        (function() {
            function w() {
                var all = document.documentElement; // 获取html元素
                var test = all.getBoundingClientRect().width; // 获取当前设备的宽度、
                //             console.log(123,test)
                if (test > 1024) {
                    test = 1024;
                }
                rem = test / 18.75;
                all.style.fontSize = rem + 'px'
            }
            w();
            window.addEventListener("resize", function() {
                w()
            }, false)
        })();
    </script>
    <script>
        var right_nav = document.querySelector('.right-nav')
        window.onscroll = function() {
            right_nav.onclick = function() {
                document.documentElement.scrollTop = 0
            }
            if (document.documentElement.scrollTop >= 791) {
                right_nav.style = "display:block"
            } else {
                right_nav.style = "display:none"
            }
        }
    </script>

</body>

</html>